<template>
    <div class="sidebar">
        <div v-if="infos.plateMode == 3" class="logo"><img src="../assets/img/logo1.png">
            <!-- {{platformName}} -->
        </div>
        <div v-if="infos.plateMode != 3" class="logoAuto"><img src="../assets/img/logo.png">
            {{platformName}}
        </div>
        <el-menu
            class="sidebar-el-menu"
            :default-active="onRoutes"
            :collapse="collapse"
            background-color="#212D4B"
            text-color="rgba(255, 255, 255, 0.66)"
            active-text-color="#fff"
            unique-opened
            router
        >
            <template v-for="item in items">
                <el-menu-item
                :index="item.index"
                :key="item.index"
                v-if="item.children.length == 0"
                class="sidebarNav"
                >
                <img width="14" height="14" :src="item.img" />
                <img width="14" height="14" class="imgHOver" :src="item.imgHOver" />
                <template #title>{{ item.title }}</template>
                </el-menu-item>
                <el-submenu :index="item.index" :key="item.index" v-else>
                <template #title>
                    <img width="14" height="14" :src="item.img" />
                    <img width="14" height="14" class="imgHOver" :src="item.imgHOver" />
                    <span>{{ item.title }}</span>
                </template>
                <el-menu-item-group>
                    <el-menu-item
                    v-for="chl in item.children"
                    :key="chl.index"
                    :index="chl.index"
                    class="sidebarNav"
                    >{{ chl.title }}</el-menu-item
                    >
                </el-menu-item-group>
                </el-submenu>
            </template>
        </el-menu>
    </div>
</template>

<script>
// import bus from "../common/bus";
export default {
    data() {
        return {
            platformName: '',
            infos: JSON.parse(localStorage.getItem("linggong_info")),
            logoAuto: false,
            items: [
                {
                    img: "img/sidebar1.png",
                    imgHOver: "img/sidebar01.png",
                    index: "index",
                    title: "首页",
                    children: [],
					details: []
                },
                {
                    img: "img/sidebar3.png",
                    imgHOver: "img/sidebar03.png",
                    index: "1",
                    title: "企业管理",
					details: [],
                    children: [
                        {
                            index: "businessManage",
                            title: "企业列表",
                            details: []
                        },
                        {
                            index: "businessExamine",
                            title: "企业审核",
                            details: []
                        },
                        {
                            index: "taxMannge",
                            title: "税源地设置",
                            details: []
                        },
                        {
                            index: "taxSource",
                            title: "关联税源地",
                            details: []
                        },
                        
                    ]
                },
                {
                    img: "img/sidebar8.png",
                    imgHOver: "img/sidebar08.png",
                    index: "2",
                    hidden: 2,
                    title: "项目管理",
                    details: [],
                    children: [
                        {
                        index: "project",
                        title: "项目管理",
                        details: []
                        },
                    ],
                },
                
                {
                    img: "img/sidebar4.png",
                    imgHOver: "img/sidebar04.png",
                    index: "3",
                    title: "服务者管理",
                    hidden: 0,
					details: [],
                    children: [
                        {
                            index: "serveManage",
                            title: "服务者列表",
                            details: []
                        },
                    ]
                },
                {
                    img: "img/sidebar5.png",
                    imgHOver: "img/sidebar05.png",
                    index: "4",
                    title: "个体商户管理",
                    hidden: 1,
					details: [],
                    children: [
                        {
                            index: "personManage",
                            title: "个体商户列表",
                            details: ['personManageDel']
                        },
                    ]
                },
                {
                    img: "img/sidebar6.png",
                    imgHOver: "img/sidebar06.png",
                    index: "5",
                    title: "任务管理",
                    hidden: 0,
					details: [],
                    children: [
                        {
                            index: "taskManage",
                            title: "任务列表",
                            details: []
                        }
                    ]
                },
                {
                    img: "img/sidebar7.png",
                    imgHOver: "img/sidebar07.png",
                    index: "6",
                    title: "财务管理",
                    hidden: 2,
                    details: [],
                    children: [
                        {
                        index: "settlements",
                        title: "无感发薪结算单",
                        details: []
                        },
                        {
                        index: "invoiceManages",
                        title: "发票管理",
                        details: []
                        },
                        {
                        index: "examine",
                        title: "线上打款记录",
                        details: []
                        },
                        {
                        index: "recharge",
                        title: "充值记录",
                        details: []
                        },
                        {
                        index: "surplus",
                        title: "余额查询",
                        details: []
                        },
                    ],
                },
                {
                    img: "img/sidebar7.png",
                    imgHOver: "img/sidebar07.png",
                    index: "7",
                    title: "财务管理",
                    hidden: 1,
					details: [],
                    children: [
                        {
                            index: "financeManage",
                            title: "打款审核",
                            details: []
                        },
                        {
                            index: "financeList",
                            title: "结算单列表",
                            details: []
                        },
                        {
                            index: "invoiceManage",
                            title: "发票管理",
                            details: []
                        },
                        {
                            index: "invoicePerson",
                            title: "个体工商户发票管理",
                            details: []
                        },
                        {
                        index: "examine",
                        title: "线上打款记录",
                        details: []
                        },
                        {
                        index: "recharge",
                        title: "充值记录",
                        details: []
                        },
                        
                    ]
                },
                {
                    img: "img/sidebar7.png",
                    imgHOver: "img/sidebar07.png",
                    index: "7",
                    title: "财务管理",
                    hidden: 3,
					details: [],
                    children: [
                        {
                            index: "financeManage",
                            title: "打款审核",
                            details: []
                        },
                        {
                            index: "financeList",
                            title: "结算单列表",
                            details: []
                        },
                        {
                            index: "invoiceManage",
                            title: "发票管理",
                            details: []
                        },
                        {
                        index: "examine",
                        title: "线上打款记录",
                        details: []
                        },
                        {
                        index: "recharge",
                        title: "充值记录",
                        details: []
                        },
                        {
                        index: "surplus",
                        title: "余额查询",
                        details: []
                        },
                    ]
                }
            ]
        };
    },
    mounted () { 

        // let info = {
        //     plateMode: 3
        // }

        let info = JSON.parse(localStorage.getItem("linggong_info"))
        // console.log(info)

        this.platformName = info.platformName

        if(info.platformName.length >= 7 ){
            this.logoAuto = true;
        }

        // console.log(info.plateMode)

        for (let i = this.items.length -1; i >=0; i--) {  
            if (info.plateMode === 3) {
                if (this.items[i].hidden === 0 || this.items[i].hidden === 1  || this.items[i].hidden === 3) this.items.splice(i, 1);  
            }else if (info.plateMode === 1) {
                if (this.items[i].hidden === 2 || this.items[i].hidden === 3) this.items.splice(i, 1);  
            } else  {
                if (this.items[i].hidden === 2 || this.items[i].hidden === 1) this.items.splice(i, 1);  
            }
        }  
        
    },
    computed: {
        onRoutes() {
            // 根据route地址判断左侧导航选中
            let path = this.$route.path.replace("/", "");
            let rPath = "";
            for (let i = 0; i < this.items.length; i++) {
                let item = this.items[i];
                if (!item.img.startsWith("data:image")) {
                    item.img = require("../assets/" + item.img);
                }
                if (!item.imgHOver.startsWith("data:image")) {
                    item.imgHOver = require("../assets/" + item.imgHOver);
                }
                if (item.index == path || item.details.includes(path)) {
                    rPath = item.index;
                }else {
                    for(let k = 0; k < item.children.length; k++) {
                        if(item.children[k].index == path || item.children[k].details.includes(path)) {
                            rPath = item.children[k].index;
                        }
                    }
                }
            }
            return rPath;
        },
        collapse(){
            return this.$store.state.collapse
        }
    }
};
</script>

<style scoped>
li.sidebarNav.el-menu-item.is-active {
    background: #026BE4 !important;
}
.sidebar {
    display: block;
    position: absolute;
    left: 0;
    top: 0px;
    bottom: 0;
    overflow-y: scroll;
    z-index: 1;
    width: 14%;
    background-color: rgb(33, 45, 75);
}
.sidebar::-webkit-scrollbar {
    width: 0;
}
.sidebar-el-menu:not(.el-menu--collapse) {
    width: 100%;
    border: 0;
}
.sidebar > ul {
    height: calc(100% - 60px);

}
.el-menu-item [class^=el-icon-] {
    position: relative;
    top: -2px;
}
.logo,.logoAuto {
  background: rgb(33, 45, 75);
  color: #fff;
  font-size: 18px;
  height: 60px;
  line-height: 60px;
}
.logoAuto {
  font-size: 16px;
}
.logo img {
  /* width: 40px; */
  height: 30px;
    float: left;
    margin: 20px 10px 0 20px;
  /* border-radius: 100%; */
}
.logoAuto img {
  width: 40px;
    float: left;
    margin: 12px 10px 0 20px;
  border-radius: 100%;
}
.sidebar-el-menu[data-v-7d622f5c]:not(.el-menu--collapse) {
    width: 100%;
}
.el-menu-item img,.el-submenu img {
    margin: -1px 9px 0 0;
}
.el-menu-item img.imgHOver,.el-menu-item.is-active img,.el-submenu img.imgHOver,.el-submenu.is-opened img  {
    display: none;
}
.el-menu-item.is-active img.imgHOver,.el-submenu.is-opened img.imgHOver {
   display: inline-block;
}
.el-submenu .el-menu-item {
    background: #1a243c !important;
}
.el-submenu .el-menu-item:hover,.el-submenu .el-menu-item.is-active{
    background: #026BE4 !important;
    color: #fff !important;
}
</style>
